{% extends "base.html" %}

{% block title %}个人资料 - 车辆管理系统{% endblock %}

{% block content %}
<div class="container py-4">
    <div class="row mb-4">
        <div class="col">
            <h2>个人资料</h2>
            <p class="text-muted">查看和管理您的个人信息</p>
        </div>
        <div class="col-auto d-flex align-items-center">
            <a href="{{ url_for('user_dashboard') }}" class="btn btn-secondary">
                <i class="fas fa-arrow-left"></i> 返回仪表板
            </a>
        </div>
    </div>
    
    <div class="row">
        <div class="col-md-4">
            <div class="card mb-4">
                <div class="card-header bg-primary text-white">
                    <h5 class="mb-0">账户信息</h5>
                </div>
                <div class="card-body">
                    <div class="text-center mb-4">
                        <div class="avatar-placeholder bg-light rounded-circle d-inline-flex justify-content-center align-items-center" style="width: 120px; height: 120px; font-size: 48px;">
                            {{ user.username[0]|upper }}
                        </div>
                    </div>
                    <ul class="list-group list-group-flush">
                        <li class="list-group-item d-flex justify-content-between">
                            <span>用户ID:</span>
                            <span>{{ user.id }}</span>
                        </li>
                        <li class="list-group-item d-flex justify-content-between">
                            <span>用户角色:</span>
                            <span>
                                {% if user.role == 'admin' %}
                                    <span class="badge bg-danger">管理员</span>
                                {% else %}
                                    <span class="badge bg-primary">普通用户</span>
                                {% endif %}
                            </span>
                        </li>
                        <li class="list-group-item d-flex justify-content-between">
                            <span>注册时间:</span>
                            <span>{{ user.created_at.strftime('%Y-%m-%d') }}</span>
                        </li>
                    </ul>
                </div>
            </div>
            
            <div class="card">
                <div class="card-header bg-info text-white">
                    <h5 class="mb-0">账户管理</h5>
                </div>
                <div class="card-body">
                    <div class="d-grid gap-2">
                        <a href="{{ url_for('edit_profile') }}" class="btn btn-outline-primary">
                            <i class="fas fa-user-edit"></i> 编辑个人资料
                        </a>
                        <a href="{{ url_for('change_password') }}" class="btn btn-outline-warning">
                            <i class="fas fa-key"></i> 修改密码
                        </a>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="col-md-8">
            <div class="card">
                <div class="card-header bg-success text-white">
                    <h5 class="mb-0">个人详细信息</h5>
                </div>
                <div class="card-body">
                    <table class="table">
                        <tbody>
                            <tr>
                                <th style="width: 30%">用户名</th>
                                <td>{{ user.username }}</td>
                            </tr>
                            <tr>
                                <th>手机号</th>
                                <td>{{ user.phone }}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            
            <div class="card mt-4">
                <div class="card-header">
                    <h5 class="mb-0">快捷操作</h5>
                </div>
                <div class="card-body">
                    <div class="row g-3">
                        <div class="col-md-4">
                            <a href="{{ url_for('add_vehicle') }}" class="btn btn-outline-primary d-block h-100 d-flex flex-column justify-content-center align-items-center p-3">
                                <i class="fas fa-car fa-2x mb-2"></i>
                                <span>添加车辆</span>
                            </a>
                        </div>
                        <div class="col-md-4">
                            <a href="{{ url_for('reserve_parking_form') }}" class="btn btn-outline-success d-block h-100 d-flex flex-column justify-content-center align-items-center p-3">
                                <i class="fas fa-calendar-alt fa-2x mb-2"></i>
                                <span>预约停车位</span>
                            </a>
                        </div>
                        <div class="col-md-4">
                            <a href="{{ url_for('camera_recognition') }}" class="btn btn-outline-info d-block h-100 d-flex flex-column justify-content-center align-items-center p-3">
                                <i class="fas fa-camera fa-2x mb-2"></i>
                                <span>摄像头识别</span>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %} 